<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <#include "/pubHeadStyleTree.html">
</head>
<body>
<div style="position: relative;height: 100%;">
    <div class="ccpui-trees" >
        <p class="isShowTree colorSwitch">
            <input type="hidden" name="selectedFlowId">
            <input type="hidden" name="selectedFlowKey">
            <input type="hidden" name="selectedFlowName">
            <input type="hidden" name="selectedProcDefId">
            <span style="float: left;color: white">&nbsp;&nbsp;流程分类管理</span>
            <i layadmin-event="treeFlexible" class="layui-icon layui-icon-prev"></i>
        </p>
        <div style="margin-top: 6px;" >
            <ul class="ccpui-iconTree iconTrees">
                <li><a class="iconfont iconshuaxin- zTree-refresh" title="刷新"></a></li>
                <li><a class="iconfont iconwenjianjia1-copy zTree-triangle-d" title="展开"></a></li>
                <li><a class="iconfont iconfolder1 zTree-triangle-r" title="收起"></a></li>
                <input type="text" style="width: 50%" class="catZtreeValue">
            </ul>
            <ul id="processTree" class="ztree ccpui-listZtree"></ul>
        </div>
    </div>
    <div class="ccpui-tablesize user" style="position: absolute;top:10px;right:10px;bottom: 0;left: 250px">
        <table class="layui-hide" id="flowList" lay-filter="flowList" style="width:100%"></table>
    </div>
</div>
<!--<div class="layui-btn-container" style="position: absolute;bottom: 15px;left:45%">-->
    <!--<a class="layui-btn layui-btn-sm" id="select" style="margin-bottom: 0">选择</a>-->
    <!--<a class="layui-btn layui-btn-danger layui-btn-sm" style="margin-bottom: 0" id="cancel">取消</a>-->
<!--</div>-->
<script type="text/html" id="customHeaderTool">
    <!--<div class="layui-btn-container">-->

    <!--</div>-->
    <form class="layui-form" action="" style="margin-top:10px" lay-filter="queryForm">
        <div class="table-top-filter" style="width: 580px">
            <div class="table-filter-alone">
                <label class="layui-form-label">标题:</label>
                <input type="text" name="Q_name_SL" id="name" class="layui-input filter-value" placeholder="标题"
                       autocomplete="off"/>
            </div>
            <div class="table-filter-alone" style="float: right;margin: 3px 10px 0 0;">
                <a class="layui-btn layui-btn-sm" lay-event="query">
                    <i class="layui-icon layui-icon-search"></i>
                    <span>查询</span>
                </a>
            </div>
        </div>
    </form>
</script>
<script>
    layui.config({
        base: serverPath.systemPath + staticPath.systemPath //静态资源所在路径
    }).extend({
        index: 'index' //主入口模块
    }).use(['index','table', 'layer', 'jquery', 'form', 'tree','commons', 'totalFilter', 'setter','common'], function () {
        var table = layui.table, layer = layui.layer, setter = layui.setter, commons = layui.commons,
            totalFilter = layui.totalFilter, form = layui.form ,common = layui.common;
        $("#cancel").click(function () {
            parent.layer.close(parent.layer.getFrameIndex(window.name));
        });

        var selectedFlowId = "";
        var selectedFlowKey = "";
        var selectedFlowName = "";
        var selectedProcDefId = "";

        table.on('radio(flowList)',function (obj) {
            var data = obj.data;
            selectedFlowId = data.id;
            selectedFlowKey = data.modelKey;
            selectedFlowName = data.name;
            selectedProcDefId = data.procDefId;
            $("input[name=selectedFlowId]").val(selectedFlowId);
            $("input[name=selectedFlowKey]").val(selectedFlowKey);
            $("input[name=selectedFlowName]").val(selectedFlowName);
            $("input[name=selectedProcDefId]").val(selectedProcDefId);
        });

        //刷新
        $(".zTree-refresh").click(function () {
            resZtrees();
        });
        //展开
        $(".zTree-triangle-d").click(function () {
            $.fn.zTree.getZTreeObj("processTree").expandAll(true);
        });
        //收起
        $(".zTree-triangle-r").click(function () {
            $.fn.zTree.getZTreeObj("processTree").expandAll(false);
        });
        resZtrees();
        loadTable('/workflow/actDefModel/flowSelector');
        totalFilter.init();
        function resZtrees() {
            $.ajax({
                url: serverPath.systemPath + setter.sysLinkPath + "globalType/list",
                type: "post",
                dataType: 'json',
                data: {"catKey": "FLOW_TYPE", "hasRoot": 1},
                success: function (data) {
                    var zNodes = data.data;
                    var setting = {
                        view: {
                            showLine: false,
                            nameIsHTML: true, //允许name支持html
                            selectedMulti: false
                        },
                        edit: {
                            enable: false,
                            editNameSelectAll: false
                        },
                        data: {
                            simpleData: {
                                enable: true,
                                idKey: "typeId",
                                pIdKey: "parentId"

                            },
                            key: {
                                name: "typeName"
                            }
                        },

                        callback: {
                            onClick: onClickType
                        }
                    };
                    $.fn.zTree.init($('#processTree'), setting, zNodes);
                    component.fuzzySearch('processTree', null, true); //初始化模糊搜索方法
                }
            });
        }
        var typeId = "";
        var typeName = "";
        function onClickType(event, treeId, treeNode) {
            typeId = treeNode.typeId;
            typeName = treeNode.nodeKey;
            var url = '/workflow/actDefModel/flowSelector?typeId=' + typeId;
            if (null == treeNode.parentId) {
                url = '/workflow/actDefModel/flowSelector';
            }
            loadTable(url);
        }
        //树状菜单隐藏
        var treeval = true;
        $(".treeone").click(function () {
            treeval = tresStyle(treeval, ".treeone");
        });
        function onClickRess(event, treeId, treeNode, clickFlag) {
            selectOrgId = treeNode.orgId;
        }
        function loadTable(url) {
            table.render({
                elem: '#flowList'
                , url: serverPath.basePath +  url
                , title: '流程选择'
                ,height:'full-10'
                , defaultToolbar: []
                , toolbar: '#customHeaderTool'
                , cols: [[
                    {type: 'radio', fixed: 'left'}
                    , {field: 'name', title: '标题', align: 'center'}
                    , {field: 'typeName', title: '分类', align: 'center'}
                    , {field: 'version', title: '版本', align: 'center'}
                    , {field: 'status', title: '状态', align: 'center',templet: function (d) {
                            var status = d.status;
                            switch (status) {
                                case 0:
                                    return "未发布";
                                case 1:
                                    return "发布";
                                case 2:
                                    return "禁用";
                                case 3:
                                    return "禁用，并禁用实例";
                                case 4:
                                    return "测试";
                            }
                        }}
                ]]
                , page: true
            });
        }

        //头工具栏事件
        table.on('toolbar(flowList)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data; //获取选中行数据
            switch (obj.event) {
               case 'query':
                   common.tableConditionRender("flowList","queryForm",{where:{}},false);
                    break;
            }
        })
    });
</script>
<style>
    .table-top-filter label.layui-form-label{
        width: 85px;
    }
</style>
</body>
</html>